<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorate="layout">
<head>
    <title>签到查询</title>
</head>
<body>
<!--<h1 layout:fragment="header">Messages : View all</h1>-->
<div layout:fragment="content" class="container">
    <div class="box-header with-border">
        <h3 class="box-title">签到查询</h3>
    </div>
    <!-- /.box-header -->
    <!-- form start -->
    <form class="form-horizontal" role="form">
        <div class="box-body">
            <div class="form-group col-md-3">
                <label for="search_name" class="col-sm-4 control-label">姓名</label>

                <div class="col-xs-8 no-padding">
                    <input type="text" id="search_name" class="form-control" placeholder="姓名" name="search_name">
                </div>
            </div>
            <div class="form-group col-md-3">
                <label for="search_stat" class="col-sm-4 control-label">签到状态</label>

                <div class="col-xs-8 no-padding">
                    <select id="search_stat" class="form-control" name="search_stat">
                        <option value="0">未签到</option>
                        <option value="1">签到</option>
                    </select>
                </div>
            </div>
            <div class="form-group col-md-4 right-button">
                <button onclick="searchBtn()" type="button" class="btn btn-danger right-button">搜索</button>
                <button onclick="importBtn()" type="button" class="btn btn-danger right-button">初始化导入(会删除所有数据)</button>
                <button onclick="updateBtn()" type="button" class="btn btn-danger right-button">更新数据</button>
            </div>
        </div>
    </form>
    <div class="box-body">
        <table id="GameScore" class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>序号</th>
                <th>姓名</th>
                <th>手机</th>
                <th>机构名</th>
                <th>签到状态</th>
                <th>列x</th>
                <th>排y</th>
            </tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
    <div id="GameScore-modal-form" class="modal" tabindex="-1" aria-hidden="true" style="display: none;">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">×</button>
                    <h4 class="blue bigger">签到信息导入</h4>
                </div>
                <form action="../../admin/GameScore/import" id="GameScoreFileForm" method="post" enctype="multipart/form-data">
                    <div class="modal-body">
                        <fieldset>
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right">导入签到信息：</label>
                                <div class="">
                                    <input type="file" id="importGameScoreFile" name="meetFile"/>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                    <div class="modal-footer">
                        <button type="reset" class="btn btn-sm" data-dismiss="modal">
                            <i class="ace-icon fa fa-times"></i>
                            返回
                        </button>
                        <button type="button" onclick="submitMeetFile()" class="btn btn-sm btn-primary">
                            <i class="ace-icon fa fa-check"></i>
                            提交
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div id="GameScore-modal-form-update" class="modal" tabindex="-1" aria-hidden="true" style="display: none;">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">×</button>
                    <h4 class="blue bigger">签到信息更新</h4>
                </div>
                <form action="../../admin/GameScore/restful/update" id="GameScoreFileFormUpdate" method="post" enctype="multipart/form-data">
                    <div class="modal-body">
                        <fieldset>
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right">更新签到信息：</label>
                                <div class="">
                                    <input type="file" id="importGameScoreFileUpdate" name="meetFile"/>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                    <div class="modal-footer">
                        <button type="reset" class="btn btn-sm" data-dismiss="modal">
                            <i class="ace-icon fa fa-times"></i>
                            返回
                        </button>
                        <button type="button" onclick="updateMeetFile()" class="btn btn-sm btn-primary">
                            <i class="ace-icon fa fa-check"></i>
                            提交
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        var table;
        $(function(){
            table=$("#GameScore").DataTable({
                "ajax": {
                    url:"../../admin/GameScore/Get",
                    type:"POST",
                    dataType: "json",
                    data:function(d){
                        d.name=$("#search_name").val()
                        d.is_sign=$("#search_stat").val()
                    },error:function(XMLHttpRequest,textStatus,errorThrown){
                        console.log("载入数据出错");
                    }
                },
                "scrollX": 1200,
                "bProcessing": true,
                "bServerSide": true,
                "bPaginate": true,
                "bAutoWidth": false,
                "bInfo": true,//页脚信息
                "bFilter": false,//禁用搜索
                "bSort":false,//禁用排序
                "aLengthMenu": [20,30,40],
                "sPaginationType":'full_numbers',
                "columns": [
                    {"data":"id"},
                    { "data": "name" },
                    { "data": "tel" },
                    { "data": "org_name" },
                    { "data": "is_sign" },
                    { "data": "sit_x" },
                    { "data": "sit_y" },
                ],
                "aoColumnDefs": [
                    {
                        "aTargets": [ 4 ],
                        "mRender": function ( data, type, full ) {
                            switch (data){
                                case 0:return "未签到";break;
                                case 1:return "签到";break;
                                default :return " ";break;
                            }
                        }
                    }
                ],
                "fnRowCallback": function (nRow, aData, iDisplayIndex) {
                    $("td:first", nRow).html(iDisplayIndex + 1);
                    return nRow;
                },
                "oLanguage": {
                    "sProcessing": "处理中...",
                    "sLengthMenu": "每页 _MENU_ 条",
                    "sZeroRecords": "没有匹配结果",
                    "sInfo": " _START_ 至 _END_ 项结果，共 _TOTAL_ 项",//显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项
                    "sInfoEmpty": "",//显示第 0 至 0 项结果，共 0 项
                    "sInfoFiltered": "",//(由 _MAX_ 项结果过滤)
                    "sInfoPostFix": "",
                    "sSearch": "搜索：",
                    "sUrl": "",
                    "sEmptyTable": "没有数据呀!",
                    "sLoadingRecords": "载入中...",
                    "sInfoThousands": ",",
                    "oPaginate": {
                        "sFirst": "首页",
                        "sPrevious": "上页",
                        "sNext": "下页",
                        "sLast": "末页"
                    }
                },
            });
            importConfig($);
        })

        function searchBtn(){
            table.draw();
        }


        function importBtn() {
            $("#GameScore-modal-form").modal("show");
        }
        function updateBtn() {
            $("#GameScore-modal-form-update").modal("show");
        }

        function importConfig($) {
            $("#importGameScoreFile").ace_file_input({
                no_file:'选择文件 ...',
                btn_choose:'选择',
                btn_change:'选择',
                droppable:false,
                thumbnail:false, //| true | large
                whitelist:'xlsx|xls'
            }).on('change', function(){
                var names=$(this).data('ace_input_files')[0].name.split(".")
                if(names[names.length-1]!=="xlsx"&&names[names.length-1]!=="xls"){
                    alert("只接受xlsx或xls文件")
                    return
                }
            });
        }
        function updateConfig($) {
            $("#importGameScoreFileUpdate").ace_file_input({
                no_file:'选择文件 ...',
                btn_choose:'选择',
                btn_change:'选择',
                droppable:false,
                thumbnail:false, //| true | large
                whitelist:'xlsx|xls'
            }).on('change', function(){
                var names=$(this).data('ace_input_files')[0].name.split(".")
                if(names[names.length-1]!=="xlsx"&&names[names.length-1]!=="xls"){
                    alert("只接受xlsx或xls文件")
                    return
                }
            });
        }

        function submitMeetFile() {
            $("#GameScoreFileForm").ajaxSubmit({
                type: 'POST',
                dataType: "json",
                url:"../../admin/GameScore/import",
                success: function(data){
                    console.log(data);
                    if(data){
                        Lobibox.notify('success', {
                            msg: "导入成功",
                            sound: false
                        });
                        table.draw();
                    }else {
                        Lobibox.notify('error', {
                            msg: "导入失败",
                            sound: false
                        });
                    }
                    $("#GameScore-modal-form").modal("hide")
                },
                error: function(XmlHttpRequest, textStatus, errorThrown){
                    alert( "尝试刷新网页或联系技术人员");
                }
            })
        }
        function updateMeetFile() {
            $("#GameScoreFileFormUpdate").ajaxSubmit({
                type: 'POST',
                dataType: "json",
                url:"../../admin/GameScore/restful/update",
                success: function(data){
                    console.log(data);
                    if(data){
                        Lobibox.notify('success', {
                            msg: "更新成功",
                            sound: false
                        });
                        table.draw();
                    }else {
                        Lobibox.notify('error', {
                            msg: "更新失败",
                            sound: false
                        });
                    }
                    $("#GameScore-modal-form-update").modal("hide")
                },
                error: function(XmlHttpRequest, textStatus, errorThrown){
                    alert( "尝试刷新网页或联系技术人员");
                }
            })
        }
    </script>
</div>
</body>
</html>
